<template>
  <div class="judgment-manager">
    <div class="all_container">
      <div class="order_detail--container">
        <div class="order_detail--header">
          <div class="order_detail_left">
            <title-view :title="'判责信息' + (detailDate.assignBlameNo || '')" />
            <div class="judgment-status" :class="getjStatusClass(detailDate.assignBlameState)">
              {{ getjStatusLabel(detailDate.assignBlameState) }}
            </div>
          </div>
          <el-button type="info" color="#F2F3F5" @click="handleGoto">返回上一页</el-button>
        </div>
        <div class="order_detail--title" v-if="detailDate.assignBlameState == 4 && titleleft !== '' && titleleft !== null">
          <div class="detail_title_item">拒绝理由：</div>
          <div class="detail_title_right">
            <show-more-text :text="titleleft"></show-more-text>
          </div>
        </div>
        <div class="order_detail--body">
          <div class="order_body--title" style="margin-top: 4px; margin-bottom: 14px">
            <div class="order_body--titleleft">判责信息</div>
            <div class="order_body--rightpztitle">
              <div class="order_body_rightpztitleone">
                预计判责总金额：
                <span style="color: #ff3333"> ¥{{ detailDate.actualAssignBlameAmount }}</span>
              </div>
              <div class="order_body--titleright">公司承担金额：¥{{ getAmount() }}</div>
            </div>
          </div>
          <div>
            <el-row class="table_head">
              <el-col :span="3" class="table_head--col">合作方类型</el-col>
              <el-col :span="3" class="table_head--col">责任人角色</el-col>
              <el-col :span="3" class="table_head--col">负责人</el-col>
              <el-col :span="3" class="table_head--col">
                <el-tooltip
                  class="box-item"
                  effect="dark"
                  :content="`判责金额=判责比例*判责金额&nbsp;&nbsp;&nbsp判责比例:该责任人配置的判责比例&nbsp;&nbsp;&nbsp判责金额：报价变更单的售后单分类对应的判责金额取值总和`"
                  placement="top-start"
                >
                  判责金额(元)
                </el-tooltip>
              </el-col>
              <el-col :span="2" class="table_head--col">状态</el-col>
              <el-col :span="2" class="table_head--col">已核销金额</el-col>
              <el-col :span="2" class="table_head--col">判责时间</el-col>
              <el-col :span="2" class="table_head--col">确认/核实时间</el-col>
              <el-col :span="3" class="table_head--col">备注</el-col>
              <el-col :span="1" class="table_head--col">操作</el-col>
            </el-row>
            <el-form :model="detailDate" ref="ruleFormRef">
              <div class="tablerow_body" v-for="(item, index) in detailDate.judgemnetArry">
                <el-row style="margin-top: 10px">
                  <!-- 合作方类型-->
                  <el-col :span="3" class="tablerow_body--col">
                    <div class="tablerow_body--select">
                      <el-form-item
                        :prop="`judgemnetArry[${index}].type`"
                        :rules="[{ required: true, message: '请选择合作方类型', trigger: 'change' }]"
                      >
                        <el-select
                          v-model="item.type"
                          placeholder="请选择"
                          :disabled="item.assignBlameState && item.assignBlameState !== 1"
                          @change="handleClicktype(item)"
                        >
                          <el-option v-for="item in type" :key="item.value" :label="item.label" :value="item.value" />
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                  <!-- 责任人角色-->
                  <el-col :span="3" class="tablerow_body--col">
                    <div class="tablerow_body--select">
                      <el-form-item
                        :prop="`judgemnetArry[${index}].roleId`"
                        v-if="item.type == 7"
                        :rules="[{ required: true, message: '请选择责任人角色', trigger: 'change' }]"
                      >
                        <el-select
                          v-model="item.roleId"
                          placeholder="请选择"
                          @change="handleClickrole(item)"
                          :disabled="item.assignBlameState && item.assignBlameState !== 1"
                        >
                          <el-option v-for="v in roleList" :key="v.roleId" :label="v.roleName" :value="v.roleId" />
                        </el-select>
                      </el-form-item>
                      <div v-if="item.type !== 7" class="tablerow_body--selectdiv">
                        <div class="tablerow_body--divline">--</div>
                      </div>
                    </div>
                  </el-col>

                  <!--负责人 -->
                  <el-col :span="3" class="tablerow_body--col">
                    <div class="tablerow_body--select">
                      <!--      员工负责人                -->
                      <el-form-item
                        v-if="![2, 3, 4, 5, 6].includes(item.type)"
                        :prop="`judgemnetArry[${index}].userId`"
                        :rules="[{ required: true, message: '请选择负责人', trigger: 'change' }]"
                      >
                        <el-select
                          filterable
                          v-model="item.userId"
                          placeholder="请选择"
                          @focus="fetchOptions(item)"
                          @change="handleClickuser(item)"
                          :disabled="item.assignBlameState && item.assignBlameState !== 1"
                        >
                          <el-option
                            v-for="item in item.options"
                            :key="item.userId"
                            :label="item.nickName"
                            :value="item.userId"
                          />
                        </el-select>
                      </el-form-item>
                      <!--         供应商负责人             -->
                      <el-form-item
                        v-if="item.type === 2"
                        :prop="`judgemnetArry[${index}].userId`"
                        :rules="[{ required: true, message: '请选择负责人', trigger: 'change' }]"
                      >
                        <el-select
                          filterable
                          v-model="item.userId"
                          placeholder="请选择"
                          :disabled="item.assignBlameState && item.assignBlameState !== 1"
                          @change="handleClickuser(item)"
                        >
                          <el-option
                            v-for="item in optionstwo"
                            :key="item.factoryId"
                            :label="item.factoryName"
                            :value="item.factoryId"
                          />
                        </el-select>
                      </el-form-item>
                      <!--       其他、工人、物流运输、项目经理 负责人                -->
                      <el-form-item
                        v-if="[3, 4, 5, 6].includes(item.type)"
                        :prop="`judgemnetArry[${index}].userId`"
                        :rules="[{ required: true, message: '请选择负责人', trigger: 'change' }]"
                      >
                        <el-select
                          popper-class="select-user-popper"
                          clearable
                          v-model="item.userId"
                          placeholder="请选择"
                          @change="handleClickuser(item)"
                          :disabled="item.assignBlameState && item.assignBlameState !== 1"
                        >
                          <template #header>
                            <div class="content-item-search">
                              <el-input placeholder="请输入关键词" v-model="item.name" @change="searchUser(item)" />
                              <svg-icon iconClass="searchBox-icon" style="font-size: 24px" @click="searchUser(item)" />
                            </div>
                          </template>
                          <el-option
                            v-for="item in item.options"
                            :key="item.userId"
                            :label="item.nickName"
                            :value="item.userId"
                          />
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                  <!--判责金额(元)-->
                  <el-col :span="3" class="tablerow_body--col">
                    <div class="tablerow_body--select">
                      <el-form-item
                        :prop="`judgemnetArry[${index}].amount`"
                        :rules="[
                          {
                            required: true,
                            message: '金额不能为空',
                            trigger: 'blur'
                          }
                        ]"
                      >
                        <el-input
                          v-model="item.amount"
                          placeholder="请输入"
                          :disabled="item.assignBlameState == 6 || item.assignBlameState == 10"
                          @input="checkInput(item)"
                        />
                      </el-form-item>
                    </div>
                  </el-col>
                  <!--状态-->
                  <el-col :span="2" class="tablerow_body--col">
                    <div class="tablerow_body--del">
                      <div class="tablerow_body--status" :class="gettabStatusClass(item.assignBlameState)">
                        {{ gettabStatusLabel(item.assignBlameState) }}
                      </div>
                    </div>
                  </el-col>
                  <!--已核销金额-->
                  <el-col :span="2" class="tablerow_body--col">
                    <div class="tablerow_body--del" style="color: #5c5c5c">
                      <div class="tablerow_body--status">
                        {{ item.clearedAmount }}
                      </div>
                    </div>
                  </el-col>
                  <!--判责时间-->
                  <el-col :span="2" class="tablerow_body--col">
                    <div class="tablerow_body--del" style="color: #5c5c5c">
                      <div class="tablerow_body--status">
                        {{ item.createTime }}
                      </div>
                    </div>
                  </el-col>
                  <!--确认/核实时间-->
                  <el-col :span="2" class="tablerow_body--col">
                    <div class="tablerow_body--del" style="color: #5c5c5c">
                      <div class="tablerow_body--status">
                        {{ item.verifiedTime }}
                      </div>
                    </div>
                  </el-col>
                  <!--备注-->
                  <el-col :span="3" class="tablerow_body--col">
                    <div class="tablerow_body--select">
                      <el-form-item>
                        <el-input
                          v-model="item.note"
                          placeholder="请输入"
                          maxlength="150"
                          :disabled="item.assignBlameState == 6 || item.assignBlameState == 10"
                        />
                      </el-form-item>
                    </div>
                  </el-col>
                  <!--操作-->
                  <el-col :span="1" class="tablerow_body--col">
                    <div
                      class="tablerow_body--del"
                      @click="handleDelect(item, index)"
                      v-if="detailDate.judgemnetArry.length > 1 && item.assignBlameState !== 6 && item.assignBlameState !== 10"
                    >
                      删除
                    </div>
                  </el-col>
                </el-row>
                <!--拒绝理由-->
                <div class="tablerow_body--foot" v-if="item.assignBlameState == 8">
                  <div class="tablerow_body--foottext">拒绝理由：{{ item.operationContent }}</div>
                  <div class="tablerow_body--footline"></div>
                  <div class="tablerow_body--footbtn">
                    <div
                      @click="handleClick(v.url, 'img')"
                      class="tablerow_body--footbtnchild"
                      v-for="v in item?.imgdata"
                      :key="v.url"
                    >
                      <img src="@/assets/images/picture.png" style="margin-left: 10px" />
                      <el-tooltip :content="urlname(v.url)" placement="bottom" effect="light">
                        <div style="width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
                          {{ urlname(v.url) }}
                        </div>
                      </el-tooltip>
                    </div>
                    <div
                      class="tablerow_body--footbtnchild"
                      @click="handleClick(v.url, 'video')"
                      v-for="v in item?.videodata"
                      :key="v.url"
                    >
                      <img src="@/assets/images/video.png" style="margin-left: 10px" />
                      <el-tooltip :content="urlname(v.url)" placement="bottom" effect="light">
                        <div style="width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap">
                          {{ urlname(v.url) }}
                        </div>
                      </el-tooltip>
                    </div>
                  </div>
                </div>
                <!--无拒绝理由-->
                <div class="tablerow_body--footother" v-if="item.assignBlameState !== 8">
                  <div style="color: #4e5969; margin-left: 12px">--</div>
                </div>
              </div>
              <div class="tablerow_body--footadd">
                <img style="width: 16px; height: 16px; margin-left: 14px" src="@/assets/images/addpz.png" />
                <div class="tablerow_body--pztext" @click="addJudgemnetArry">新增责任人</div>
              </div>
            </el-form>
          </div>

          <div class="add-order-container-white"></div>
          <div>
            <div class="order_body--title" style="margin-top: 24px">
              <div class="order_body--titleleft">需判责明细</div>
            </div>
            <div class="order_detail--titlenew">
              <div class="order_detail--amount">
                报价单增减项：<span style="color: #007dff" @click="handleGotoline(detailDate.exchangeBudgetId)">{{
                  detailDate.exchangeBudgetId || "--"
                }}</span>
              </div>
              <div class="order_detail--dividernew"></div>
              <div class="order_detail--amount">给客户赔偿金额：¥{{ detailDate.customerCompensationAmount || "0" }}</div>
            </div>

            <div v-if="returnOrder.itemList.length !== 0">
              <div class="order_table--title">
                <div class="left">
                  <title-view title="退货单" :showTagCircle="false" />
                </div>
                <div class="sum">
                  <div>
                    （费用合计：<span style="color: #ff3333">¥{{ returnOrder.refundBudgetTotlalMoney || 0 }}</span>
                  </div>
                  <div>
                    管理费：<span>¥{{ returnOrder.refundManagerFee || 0 }}</span>
                  </div>
                  <div>
                    税费：<span>¥{{ returnOrder.refundTaxesFee || 0 }}</span>
                  </div>
                  <div>
                    综合项金额：<span>¥{{ returnOrder.refundCustomComprehensiveFee || 0 }}</span>
                  </div>
                  <div>
                    其他费用：<span>¥{{ returnOrder.refundOtherFee || 0 }}</span
                    >)
                  </div>
                </div>
              </div>
              <el-table
                :data="returnOrder.itemList"
                style="width: 100%"
                border
                :header-cell-style="{ background: '#F2F6FC', color: '#4E5969', 'font-weight': 400, 'font-size': '14px' }"
              >
                <el-table-column prop="serialNo" label="序号" />
                <el-table-column prop="mainPicUrl" label="图片">
                  <template #default="{ row }">
                    <el-image class="order_show--img" :src="row.mainPicUrl" :fit="fit" />
                  </template>
                </el-table-column>
                <el-table-column prop="productName" label="商品名称" />
                <el-table-column prop="brandName" label="品牌" />
                <el-table-column prop="modeCode" label="型号" />
                <el-table-column prop="productUnit" label="单位" />
                <el-table-column prop="num" label="退换数量" />
                <el-table-column prop="realCostMoney" label="成本价" />
                <el-table-column prop="realSaleMoney" :width="160" label="实际售价" />
              </el-table>
            </div>

            <div v-if="replacementOrder.itemList.length !== 0">
              <div class="order_table--title">
                <div class="left">
                  <title-view title="换补单" :showTagCircle="false" />
                </div>
                <div class="sum">
                  <div>
                    （费用合计：<span style="color: #ff3333">¥{{ replacementOrder.budgetTotlalMoney || 0 }}</span>
                  </div>
                  <div>
                    管理费：<span>¥{{ replacementOrder.managerFee || 0 }}</span>
                  </div>
                  <div>
                    税费：<span>¥{{ replacementOrder.taxesFee || 0 }}</span>
                  </div>
                  <div>
                    综合项金额：<span>¥{{ replacementOrder.customComprehensiveFee || 0 }}</span>
                  </div>
                  <div>
                    其他费用：<span>¥{{ replacementOrder.otherFee || 0 }}</span>
                    )
                  </div>
                </div>
              </div>
              <el-table
                :data="replacementOrder.itemList"
                style="width: 100%; z-index: 0"
                border
                :header-cell-style="{ background: '#F2F6FC', color: '#4E5969', 'font-weight': 400, 'font-size': '14px' }"
              >
                <el-table-column prop="serialNo" label="序号" />
                <el-table-column prop="mainPicUrl" label="图片">
                  <template #default="{ row }">
                    <el-image class="order_show--img" :src="row.mainPicUrl" :fit="fit" />
                  </template>
                </el-table-column>
                <el-table-column prop="productName" label="商品名称" />
                <el-table-column prop="brandName" label="品牌" />
                <el-table-column prop="modeCode" label="型号" />

                <el-table-column prop="productUnit" label="单位" />
                <el-table-column prop="num" label="退换数量" />
                <el-table-column prop="realCostMoney" label="成本价" />
                <el-table-column prop="realSaleMoney" :width="160" label="实际售价" />
              </el-table>
            </div>

            <div class="add-order-container-white"></div>
            <div>
              <div class="order_body--title" style="margin-top: 24px">
                <div class="order_body--titleleft">售后信息</div>
              </div>
              <el-row style="margin: 14px 0 0" class="order_detail--row">
                <el-col :span="4" class="order_detail--bgcorlor">售后单号</el-col>
                <el-col :span="8">
                  <div class="ellipsis">
                    <el-tooltip :content="detailDate.reformNo || ''" placement="bottom" effect="light">
                      {{ detailDate.reformNo || "" }}
                    </el-tooltip>
                  </div>
                </el-col>
                <el-col :span="4" class="order_detail--bgcorlor">状态</el-col>
                <el-col :span="8" class="order_detail--borderright">
                  <div class="reform-state" :class="getStatusClass(reformState)" v-if="reformState !== 10">
                    {{ getStatusLabel(reformState) }}
                  </div>
                  <div class="order_detail_showstatus" v-if="reformState == 10">
                    <div class="order_reform" :class="getStatusClass(reformState)">
                      {{ getStatusLabel(reformState) }}
                    </div>
                    <div class="rorder_detail_showstatusdown">
                      <el-tooltip :content="detailDate.refusalReason || ''" placement="bottom" effect="light">
                        拒绝理由: {{ detailDate.refusalReason }}
                      </el-tooltip>
                    </div>
                  </div>
                </el-col>

                <el-col :span="4" class="order_detail--bgcorlor">售后类型</el-col>
                <el-col :span="8">
                  <div class="ellipsis">
                    {{ detailDate.afterSalesType == 1 ? "整改" : "增减项" }}
                  </div>
                </el-col>
                <el-col :span="4" class="order_detail--bgcorlor">售后分类</el-col>
                <el-col :span="8" class="order_detail--borderright">
                  {{ detailDate.reformTypeName }}
                </el-col>

                <el-col :span="4" class="order_detail--borderbottom order_detail--bgcorlor">需退款金额</el-col>
                <el-col :span="8" class="order_detail--borderbottom">
                  <div class="ellipsis">
                    {{ detailDate.customerCompensationAmount || "" }}
                  </div>
                </el-col>
                <el-col :span="4" class="order_detail--borderbottom order_detail--bgcorlor">问题描述</el-col>
                <el-col :span="8" class="order_detail--borderbottom order_detail--borderright">
                  <el-tooltip :content="detailDate.reformDesc || ''" placement="bottom" effect="light">
                    {{ detailDate.reformDesc }}
                  </el-tooltip>
                </el-col>
              </el-row>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="foot">
      <div class="foot_footright">
        <div class="foot_footright_cancle" @click="handleCancel">
          <div class="text">取消</div>
        </div>
        <div class="foot_footright_sure" @click="handleSubmit">
          <div class="text">提交</div>
        </div>
      </div>
    </div>
    <el-dialog v-model="dialogVisible" :before-close="handleClose" align-center width="50%">
      <ImageVideoPreview :showtype="showtype" :url="url"></ImageVideoPreview>
    </el-dialog>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { judgmentDetail, getAllRole, judgmentSubmit, getBlameslist, getRoleuser, getPartner } from "@/apis/judgment";
import { useRoute, useRouter } from "vue-router";
import showMoreText from "./showMoreText";
import { type } from "./config";
import ImageVideoPreview from "@/components/ImageVideoPreview";
import { ElMessage } from "element-plus";

const route = useRoute();
const router = useRouter();
const detailDate = ref({
  judgemnetArry: []
});
const replacementOrder = ref({
  itemList: []
}); // 换补单
const returnOrder = ref({
  itemList: []
}); // 退货单
const ruleFormRef = ref(null);
const nameTitle = ref("整改");
const dialogVisible = ref(false);
const url = ref("");
const showtype = ref("");
const optionstwo = ref([]);
const roleList = ref([]);
const statusMap = new Map([
  [1, ["warning", "待审核"]],
  [2, ["warning", "待开始"]],
  [3, ["primary", "进行中"]],
  [4, ["success", "已完成"]],
  [5, ["danger", "未通过"]],
  [6, ["info", "已作废"]],
  [7, ["primary", "审批中"]],
  [8, ["warning", "待发起客户确认"]],
  [9, ["primary", "客户确认中"]],
  [10, ["danger", "客户拒绝"]],
  [11, ["warning", "待收款"]]
]);
const judgmenMap = new Map([
  [1, ["warning", "未判责"]],
  [3, ["success", "已核实"]],
  [4, ["danger", "审批未通过"]],
  [5, ["warning", "待发起确认"]],
  [6, ["primary", "确认中"]],
  [7, ["success", "已确认"]],
  [8, ["danger", "责任人拒绝"]],
  [9, ["primary", "核实中"]],
  [10, ["primary", "审批中"]],
  [11, ["info", "已作废"]]
]);
const getAmount = () => {
  let num = 0;
  detailDate.value.judgemnetArry?.forEach(item => {
    num += Number(item.amount);
  });
  const showamount = detailDate.value?.exchangeOrderDetail?.totalAmount - num;
  if (showamount >= 0) {
    return Math.max(showamount, 0).toFixed(2);
  } else {
    return 0;
  }
};
// 获取状态 CSS 类名
const getjStatusClass = state => {
  const [statusClass] = judgmenMap.get(state) || ["danger", "--"];
  return `reform-state-${statusClass}`;
};
// 获取状态标签
const getjStatusLabel = state => {
  const [, statusLabel] = judgmenMap.get(state) || ["danger", "--"];
  return statusLabel;
};
// 获取状态 CSS 类名
const gettabStatusClass = state => {
  const [statusClass] = judgmenMap.get(state) || ["danger", "--"];
  return `statuscolor-${statusClass}`;
};
// 获取状态标签
const gettabStatusLabel = state => {
  const [, statusLabel] = judgmenMap.get(state) || ["danger", "--"];
  return statusLabel;
};
// 获取状态 CSS 类名
const getStatusClass = state => {
  const [statusClass] = statusMap.get(state) || ["danger", "--"];
  return `reform-state-${statusClass}`;
};
// 获取状态标签
const getStatusLabel = state => {
  const [, statusLabel] = statusMap.get(state) || ["danger", "--"];
  return statusLabel;
};
const urlname = url => {
  // 获取文件名和扩展名
  const fileNameWithExt = url.substring(url.lastIndexOf("/") + 1);
  // 提取文件扩展名
  const extension = fileNameWithExt.substring(fileNameWithExt.lastIndexOf("."));
  // 去掉扩展名部分，提取裸文件名
  const fileName = fileNameWithExt.substring(0, fileNameWithExt.lastIndexOf("."));
  // 解码URL编码的文件名
  const decodedFileName = decodeURIComponent(fileName);
  // 找到最后一个 '-' 的位置，通常附加标识符从这里开始
  const lastDashIndex = decodedFileName.lastIndexOf("-");
  // 去除附加标识符，重建文件名并添加扩展名
  const baseFileName = decodedFileName.substring(0, lastDashIndex).trim() + extension;
  return baseFileName;
};
const reformState = ref();
const titleleft = ref("");
const operationRecords = ref([]);
const checkInput = item => {
  // 用正则表达式替换非数字和小数点字符，并只允许一个小数点
  item.amount = item.amount.replace(/[^0-9.]/g, "").replace(/(\..*?)\..*/g, "$1");
  // 权限续长度小数点
  const parts = item.amount.split(".");
  if (parts[1] && parts[1].length > 2) {
    parts[1] = parts[1].substring(0, 2);
    item.amount = parts.join(".");
  }
  // 将字符串转换为数字
  const amount = Number(item.amount);
  // 设定最大值和清空规则
  if (amount > 99999998) {
    item.amount = "99999998"; // 设置为最大值
  } else if (amount < 0) {
    item.amount = ""; // 如果小于或等于0，则清空输入
  }
};
const fetchOptions = async item => {
  if (!item.options.length && item.roleId) {
    // 检查是否已加载过选项并且角色ID有效
    const { data } = await getRoleuser(item.roleId, ""); // 获取用户
    item.options = data; // 更新当前项的用户选项
  }
};
const handleClickuser = item => {
  if (item.type !== 2) {
    item.userName = item.options.find(v => {
      return v.userId == item.userId;
    })?.nickName;
  } else {
    item.userName = optionstwo.value.find(v => {
      return v.factoryId == item.userId;
    })?.factoryName;
  }
};
const handleClicktype = item => {
  item.roleId = null;
  item.roleName = null;
  item.userId = null;
  item.userName = null;
  if ([3, 4, 5, 6].includes(item.type)) {
    item.options = [];
  }
};
const handleClickrole = async item => {
  item.roleName = roleList.value.find(v => {
    return v.roleId == item.roleId;
  })?.roleName;
  const { data } = await getRoleuser(item.roleId, "");
  item.options = data; // 更新当前项的用户选项
  item.userId = "";
};
const getAllrolelise = async () => {
  const { data } = await getAllRole();
  roleList.value = data;
};
const getsupplier = async () => {
  const { data } = await getBlameslist(route.query.reformId);
  optionstwo.value = data.list;
};
const handleCancel = () => {
  router.go(-1);
};

const getDetail = async () => {
  const { data } = await judgmentDetail(route.query.reformId);
  nameTitle.value = data.afterSalesType === 1 ? "整改" : "增减项";
  detailDate.value = data;
  detailDate.value.judgemnetArry = data.assignBlameDetails;
  titleleft.value = detailDate.value.refusalReason;
  detailDate.value.judgemnetArry.forEach(item => {
    item.options = [
      {
        nickName: item.userName,
        userId: item.userId
      }
    ];
    if (item.picUrls !== null) {
      item.imgdata = item.picUrls.split(",").map(url => {
        const fragments = url.trim().split(".");
        const type = fragments[fragments.length - 1];
        return { url: url.trim(), type };
      });
    }
    if (item.videoUrls !== null) {
      item.videodata = item.videoUrls.split(",").map(url => {
        const fragments = url.trim().split(".");
        const type = fragments[fragments.length - 1];
        return { url: url.trim(), type };
      });
    }
  });
  replacementOrder.value = data.exchangeOrderDetail?.replacementOrder || { itemList: [] };
  if (replacementOrder.value.itemList === null) {
    replacementOrder.value.itemList = [];
  }
  returnOrder.value = data.exchangeOrderDetail?.returnOrder || { itemList: [] };
  if (returnOrder.value.itemList === null) {
    returnOrder.value.itemList = [];
  }
  reformState.value = data.reformState;
  operationRecords.value = data.operationRecords;
};
const handleClick = (v, type) => {
  url.value = v;
  showtype.value = type;
  dialogVisible.value = true;
};
const handleClose = () => {
  dialogVisible.value = false;
};
const handleDelect = (item, index) => {
  detailDate.value.judgemnetArry.splice(index, 1);
};
const addJudgemnetArry = () => {
  detailDate.value.judgemnetArry.push({
    type: "",
    userId: "",
    partnerId: "",
    userName: "",
    amount: "",
    note: ""
  });
};
const handleSubmit = async () => {
  ruleFormRef.value?.validate(valid => {
    if (valid) {
      let obj = {
        assignBlameNo: detailDate.value.assignBlameNo,
        reformId: route.query.reformId,
        assignBlameDetails: detailDate.value.judgemnetArry
      };
      judgmentSubmit(obj).then(res => {
        res.code == 200 && ElMessage.success("新增成功");
        router.go(-1);
      });
    } else {
      return false;
    }
  });
};

const handleGoto = () => {
  if (route.query.afterSalesType) {
    router.push({
      path: "/client-info",
      query: {
        customerId: detailDate.value.customerId,
        afterSalesType: route.query.afterSalesType,
        funcTab: "rectification"
      }
    });
  } else {
    router.go(-1);
  }
};
const handleGotoline = e => {
  if (e) {
    const baseRouter = window.microApp.router.getBaseAppRouter();
    const routeUrl = baseRouter.resolve({
      path: "/designer/quote-price/following/exchangeHistory",
      query: {
        exchangeBudgetId: e
      }
    });
    window.open(routeUrl.href, "_blank");
  }
};
const searchUser = async item => {
  const { data } = await getPartner({
    type: item.type,
    name: item.name || ""
  });
  let arr = data.list.map(item => {
    return {
      userId: item.partnerId,
      nickName: item.name
    };
  });
  item.options = arr || [];
};
getDetail();
getAllrolelise();
getsupplier();
</script>

<style scoped lang="scss">
@use "index";
</style>
